<template>
	<view class="myAddress">
		<view class="list">
			<view class="item" v-for="(item,index) in list" :key="index" @click="handleSelect(item)">
				<view class="user">
					<text style="font-size: 32upx;">{{item.name}}</text>
					<text style="color: #999;">{{item.tel}}</text>
					<text v-if="item.isdefault" class="is-default">默认</text>
				</view>
				<view class="address">
					{{item.area}}{{item.address}}
				</view>

				<view class="item_b">
					<view class="default_btn" @click.stop="handleSetDefault(item)">
						<view class="is_select" v-if="item.isdefault">
							<uni-icons type="checkmarkempty" color="#FFF" size="10"></uni-icons>
						</view>
						<view class="no_select" v-else>
						</view>
						<view v-if="item.isdefault" class="default_text" style="color: #263A29;">已设为默认</view>
						<view v-else class="default_text">设为默认</view>
					</view>
					<view class="" v-if="!pageType">
						<view class="edit_btn" @click.stop="handleEdit(item,index)">
							<image src="https://img.2024csnl.com/static/2.x/a102.png" mode=""></image>
							<text >编辑</text>
						</view>
						<view class="del_btn" @click.stop="handleDelete(item,index)">
							<image src="https://img.2024csnl.com/static/2.x/a103.png" mode=""></image>
							<text >删除</text>
						</view>
					</view>
				</view>
			</view>
			<view class="flex-center addressImgBox" v-if="list.length==0">
				<image src="https://wx.2024csnl.com/static/noAddress.png"></image>
				还没有收货地址哦~
			</view>
		</view>
		<view class="add_btn">
			<view class="" @click="onSkip('/package/mine/setAddress/setAddress')">新增收货地址</view>
		</view>
	</view>
</template>

<script>
	import {
		shippingAddress,
		setDefaultAddress,
		setDelAddress
	} from "../../../api/index.js"
	export default {
		data() {
			return {
				pageType:false,//是否为选择地址
				list: [],
			};
		},
		methods: {
			// 设为默认
			async handleSetDefault(item) {
				console.log(item.isdefault, item.id)
				if (item.isdefault != 1) {
					const result = await new Promise(resolve => {
						uni.showModal({
							title: '提示',
							content: '确认设置该地址为默认地址吗?',
							confirmColor: '#41644A',
							success(msg) {
								resolve(msg)
							}
						});
					})
					if (result.confirm) {
						const res = await setDefaultAddress('s=/ApiAddress/setdefault', {
							addressid: item.id
						})
						const {
							status,
							msg
						} = res.data
						this.showToast(msg)
						if (status == 1) {
							setTimeout(() => {
								this.getShippingAddress()
							}, 1500)
						}
					}
				}
			},
			// 地址列表
			async getShippingAddress() {
				const res = await shippingAddress('s=/ApiAddress/address')
				const {
					data,
					status,
					msg
				} = res.data
				console.log(res, "地址")
				if (status == 1) {
					// console.log(data,"***")
					this.list = data
				} else {
					this.showToast(msg)
				}
			},
			// 删除
			async handleDelete(item, index) {
				const result = await new Promise(resolve => {
					uni.showModal({
						title: '提示',
						content: '确认删除地址?',
						confirmColor: '#41644A',
						success(msg) {
							resolve(msg)
						}
					});
				})
				if (result.confirm) {
					const res = await setDelAddress('s=/ApiAddress/del', {
						addressid: item.id
					})
					const {
						status,
						msg
					} = res.data
					this.showToast(msg)
					if (status == 1) {
						setTimeout(() => {
							this.getShippingAddress()
						}, 1500)
					}
				}



			},
			// 编辑
			handleEdit(item, index) {
				this.onSkip(`/package/mine/setAddress/setAddress?id=${item.id}`)
			},
		
			handleSelect(item) {
				if (this.pageType) {
					uni.$emit("selectAddress", item);
					this.goBack(100);
				}

			}
		},
		onShow() {
			this.getShippingAddress()
		},
		onLoad(opt) {
			this.pageType=opt.pageType
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f7f7f7;
	}

	.addressImgBox {
		flex-direction: column;
		color: #999;
		padding-top: 20%;
	}

	.myAddress {
		padding: 26upx 20upx;
		box-sizing: border-box;

		.list {
			margin-bottom: 200upx;

			.item {
				padding: 42upx 30upx;
				box-sizing: border-box;
				background-color: #fff;
				border-radius: 20upx;
				margin-bottom: 20upx;

				.address {
					font-size: 28upx;
					color: #333333;
					font-weight: bold;
					margin-bottom: 30upx;
					font-weight: Regular;
				}

				.user {
					font-size: 28upx;
					line-height: 28upx;
					color: #292621;
					margin-bottom: 24upx;
					font-weight: Medium;

					text {
						margin-right: 24upx;
						&.is-default {
							background: -webkit-linear-gradient(left, #41644A, #263A29);
							color: #fff;
							font-size: 24rpx;
							padding: 6rpx 10rpx;
							border-radius: 10rpx;
						}
					}
				}

				.item_b {
					display: flex;
					justify-content: space-between;
					align-items: center;
					font-size: 24upx;
					color: #8A857C;
					padding-top: 32upx;
					border-top: 1px solid #F7F7F7;

					>view {
						display: flex;
						align-items: center;

						.is_select {
							width: 36upx;
							height: 36upx;
							border-radius: 10rpx;
							border: 1px solid #41644A;
							display: flex;
							justify-content: center;
							align-items: center;
							.uniui-checkmarkempty {
								color: #41644A !important;
								font-weight: bold;
							}
						}

						.no_select {
							width: 36upx;
							height: 36upx;
							border-radius: 50%;
							border: 2upx solid #F0F0F0;
						}

						.default_text {
							font-size: 26upx;
							margin-left: 20upx;
						}
						.del_btn,
						.edit_btn {
							margin-left: 42upx;
							color: #41644A;
							display: flex;
							align-items: center;
							font-size: 28rpx;
							image {
								display: block;
								width: 36rpx;
								height: 36rpx;
								margin-right: 10rpx;
							}
						}
						.del_btn {
							color: #F5222D;
						}
					}
				}
			}
		}

		.add_btn {
			width: 100%;
			padding: 30upx 20upx;
			box-sizing: border-box;
			position: fixed;
			left: 0;
			bottom: 0;
			z-index: 9;
			background-color: #f7f7f7;
			border: 4rpx solid #f7f7f7;

			>view {
				width: 100%;
				height: 86upx;
				border-radius: 14upx;
				text-align: center;
				line-height: 90upx;
				border-radius: 90rpx;
				background: -webkit-linear-gradient(left, #41644A, #263A29);
				color: #fff;
				font-size: 32upx;
			}
		}
	}
</style>
